<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%@ include file="../../foreinclude/foreHander1.jsp" %>

<div class="breadcrumb-area pt-15 pb-15">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="breadcrumb-container">
                    <nav>
                        <ul>
                            <li class="parent-page"><a href="/fore/foreIndex">首页</a></li>
                            <li>购物车</li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="page-section mb-50">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <form action="#">
                    <div class="cart-table table-responsive mb-40">
                        <table class="table">
                            <thead>
                            <tr>
                                <th class="pro-thumbnail">图片</th>
                                <th class="pro-title">名称</th>
                                <th class="pro-price">单价</th>
                                <th class="pro-quantity">数量</th>
                                <th class="pro-subtotal">小计</th>
                            </tr>
                            </thead>
                            <tbody>
                            <c:forEach items="${ois}" var="orderItem">
                                <tr>
                                    <td class="pro-thumbnail">
                                        <a href="single-product.html">
                                            <img src="${pageContext.request.contextPath}/${orderItem.product.imageurl}"
                                                 class="img-fluid" alt="Product">
                                        </a>
                                    </td>
                                    <td class="pro-title">
                                        <a href="single-product.html">${orderItem.product.name}</a>
                                    </td>
                                    <c:if test="${cst.status==0}">
                                        <td class="pro-price"><span>${orderItem.product.price}元</span></td>
                                    </c:if>
                                    <c:if test="${cst.status==1}">
                                        <td class="pro-price"><span>${orderItem.product.price*0.8}元</span></td>
                                    </c:if>
                                    <td class="pro-quantity">
                                        <div class="pro-qty"><span>${orderItem.number}</span></div>
                                    </td>
                                    <c:if test="${cst.status==0}">
                                        <td class="pro-subtotal"><span
                                                id="xiaoji1">${orderItem.number*orderItem.product.price}元</span></td>
                                    </c:if>
                                    <c:if test="${cst.status==1}">
                                        <td class="pro-subtotal"><span
                                                id="xiaoji08">${orderItem.number*orderItem.product.price*0.8}元</span>
                                        </td>
                                    </c:if>
                                </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                    </div>
                </form>

                <div class="page-section mb-50">
                    <div class="container">
                        <div class="row">
                            <div class="col-12">
                                <form action="#" class="checkout-form">
                                    <div class="row row-40">
                                        <div class="col-lg-12 mb-20">
                                            <div id="billing-form" class="mb-40">
                                                <h4 class="checkout-title">收货信息填写</h4>
                                                <div class="row">
                                                    <div class="col-md-6 col-12 mb-20">
                                                        <label>姓名</label>
                                                        <input type="text" name="name" id="name" placeholder="姓名">
                                                    </div>
                                                    <div class="col-md-6 col-12 mb-20">
                                                        <label>手机号</label>
                                                        <input type="text" name="phone" id="phone" placeholder="手机号">
                                                    </div>
                                                    <div class="col-md-6 col-12 mb-20">
                                                        <label>邮箱</label>
                                                        <input type="email" name="email" id="email" placeholder="邮箱">
                                                    </div>
                                                    <div class="col-md-12 col-12 mb-20">
                                                        <label>地址</label>
                                                        <input type="text" name="address" id="address" placeholder="地址">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-lg-12">
                                            <div class="row">
                                                <div class="col-6 mb-60">
                                                    <h4 class="checkout-title">购物车信息</h4>
                                                    <div class="checkout-cart-total">
                                                        <p>数量 <span>${number}</span></p>
                                                        <p>小计 <span>${total}元</span></p>
                                                        <p>运费 <span>10.00元</span></p>
                                                        <h4>总计 <span>${total + 10}元</span></h4>
                                                    </div>
                                                </div>
                                                <div class="col-6">
                                                    <h4 class="checkout-title">支付方式</h4>
                                                    <div class="checkout-payment-method">
                                                        <div class="single-method">
                                                            <input type="radio" id="payment_alipay" onclick="selectPayment('alipay');" name="payment-method" value="alipay">
                                                            <label for="payment_alipay">支付宝</label>
                                                            <p data-method="alipay">使用支付宝支付</p>
                                                        </div>
                                                        <div class="single-method">
                                                            <input type="radio" id="payment_token" onclick="selectPayment('token');" name="payment-method" value="token">
                                                            <label for="payment_token">代币支付</label>
                                                            <div id="token_info" style="display: none;">
                                                            </div>
                                                        </div>
                                                        <div class="single-method">
                                                            <input type="checkbox" id="accept_terms" onclick="acceptTerms(this)">
                                                            <label for="accept_terms">我已阅读并接受条款和条件</label>
                                                        </div>
                                                    </div>
                                                    <button class="place-order">
                                                        <a href="javascript:;" id="order_btn" onclick="submitOrder();">提交订单</a>
                                                    </button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </form>

                                <!-- 模拟支付弹出框 -->
                                <div id="payment_modal"
                                     style="display:none; position: fixed; z-index: 1000; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 90%; height: 90%; background: white; padding: 20px; box-shadow: 0 0 10px rgba(0,0,0,0.5);">
                                    <iframe id="alipay_frame" src="" frameborder="0"
                                            style="width: 100%; height: 100%;"></iframe>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="${pageContext.request.contextPath}/js/jquery/2.0.0/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery/2.0.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/web3@1.6.0/dist/web3.min.js"></script>
<script type="text/javascript">
    var termsAccepted = false; // 是否接受条款
    var paymentMethod = ''; // 支付方式

    function acceptTerms(checkbox) {
        termsAccepted = checkbox.checked;
    }

    function selectPayment(method) {
        paymentMethod = method;
        if (method === 'token') {
            document.getElementById('token_info').style.display = 'block';
        } else {
            document.getElementById('token_info').style.display = 'none';
        }
    }

    async function submitOrder() {
        var name = $("#name").val();
        var email = $("#email").val();
        var address = $("#address").val();
        var phone = $("#phone").val();

        if (name === "" || email === "" || address === "" || phone === "") {
            alert("请填写完整的收货信息！");
            return;
        }

        if (!termsAccepted) {
            alert("请接受条款和条件！");
            return;
        }

        if (paymentMethod === 'alipay') {
            $.ajax({
                url: '${pageContext.request.contextPath}/alipay',
                type: 'POST',
                data: {amount: '${total + 10}'},
                success: function (response) {
                    // 将支付页面HTML内容加载到iframe中
                    $("#alipay_frame").attr("srcdoc", response);
                    // 显示模态框
                    $("#payment_modal").show();
                },
                error: function () {
                    alert("支付初始化失败，请稍后再试！");
                }
            });
        } else if (paymentMethod === 'token') {
            await processTokenPayment();
        }
    }

    async function processTokenPayment() {
        if (typeof window.ethereum === 'undefined') {
            alert("请安装 MetaMask！");
            return;
        }

        const web3 = new Web3(window.ethereum);
        await ethereum.request({ method: 'eth_requestAccounts' });

        const accounts = await web3.eth.getAccounts();
        const amountInEther = '${total + 10}'; // 修改为适当的值
        const contractAddress = $('#token_address').val();

        try {
            await web3.eth.sendTransaction({
                from: accounts[0],
                to: '0xE871C4cF546721B07F400ff3edabf9c1c61d6488', // 使用用户输入的合约地址
                value: web3.utils.toWei(amountInEther, 'ether')
            });

            alert("支付成功！");
            var cstAddress = encodeURIComponent("姓名：" + $("#name").val() + ",邮箱：" + $("#email").val() + ",配送地址：" + $("#address").val() + ",手机号：" + $("#phone").val());
            window.location.href = "foreCreateOrder?address=" + cstAddress;
        } catch (error) {
            console.error(error);
            alert("支付失败！");
        }
    }
</script>

<%@ include file="../../foreinclude/foreFooter.jsp" %>
